<template>
	<view class="btn-out">
		<view class="btn-item" v-for="(i,j) in datas" :key="j">
			<view class="img">
				<image :src="i.img" class="item-img" mode="aspectFit"></image>
			</view>
			<view class="txt">
				{{i.txt}}
			</view>
		</view>
	</view>
</template>

<script>
	/**
	 * @description: 选择颜色组件
	 * @property {String} imgSrc 图片
	 * @property {String} txt 文本
	 * @event {Function} click 点击btn触发事件
	 */
	export default {
		data() {
			return {

			}
		},
		emits: ['click'],
		props: {
			datas: {
				type: Array,
				default: []
			}
		},
	}
</script>

<style lang="scss" scoped>
	.btn-out {
		display: flex;

		.btn-item {
			margin-right: 10rpx;
			width: 15%;
			display: flex;
			justify-content: space-between;
			align-items: center;
			padding: 10rpx;
			background-color: #f7f8fa;

			.img {
				width: 30rpx;
				height: 30rpx;
			}

			.item-img {
				@extend .img
			}
		}
	}
</style>
